var ObjBall = {
	creatNew:function(){
		var o = {};	//方法对象
		var attrBall = {};	//小球属性对象
		var attrSlider = {};	//滑块属性对象
		var attrBrick = [];	//障碍物属性对象集合
		var canvas,context;
		var ballTime;

		//绘制一个小球
		o.drawBall = function(x,y,r){
			context.beginPath();
			context.arc(x,y,r,0,2*Math.PI);
			context.fillStyle = attrBall.color;
			context.fill();
		};

		//绘制滑块
		//step - 与 attrSlider 对象属性对应的增量
		o.drawSlider = function(step = {}){
			context.clearRect(attrSlider.x,attrSlider.y,attrSlider.w,attrSlider.h);
			for(var k in step){
				attrSlider[k] += step[k]
			}
			//边界检测
			if(attrSlider.x < 0){
				attrSlider.x = 0;
			}else if(attrSlider.x + attrSlider.w > canvas.width){
				attrSlider.x = canvas.width - attrSlider.w;
			}
			context.beginPath();
			context.fillRect(attrSlider.x,attrSlider.y,attrSlider.w,attrSlider.h);
		};

		//绘制障碍物
		o.drawBrick = function(){
			var count = attrBrick.length;
			if(count <= 0){return false;}
			context.beginPath();
			for(var i = 0;i < count;i++){
				context.fillRect(attrBrick[i].x,attrBrick[i].y,attrBrick[i].w,attrBrick[i].h);
			}
		};

		//擦除指定障碍物
		o.clearBrick = function(i){
			context.clearRect(attrBrick[i].x,attrBrick[i].y,attrBrick[i].w,attrBrick[i].h);
			attrBrick.splice(i,1);
			if(attrBrick.length == 0){
				o.over();
			}
		};

		//小球运动流程
		o.render = function(){
			//1.记录当前状态
			var nowBall = {
				x : attrBall.x,
				y : attrBall.y,
				r : attrBall.r
			};
			//2.碰撞检测，获得下一次位置
			o.updateBall();
			var hit,area;
			//检测滑块
			hit = o.reviseBall(attrSlider);
			area = o.getArea(hit[0],hit[1],hit[2],hit[3]);
			if(area > 0){
				console.log(attrBall.vx,attrBall.vy);
				o.updateBallHit(hit);
				console.log(attrBall.vx,attrBall.vy);
				//撞击滑块后，修正角度
				/*var cx = (hit[0] + hit[2]) / 2 - attrSlider.x;
				attrBall.vx = parseInt(attrBall.vx + 5);
				attrBall.vy = parseInt(attrBall.vy - 5);
				//attrBall.vy = parseInt(attrBall.vy * cx / attrSlider.w * 2);
				console.log( cx / attrSlider.w * 2 );*/
			}else{
				//检测障碍物
				var count = attrBrick.length;
				for(var i = 0;i < count;i++){
					hit = o.reviseBall(attrBrick[i]);
					area = o.getArea(hit[0],hit[1],hit[2],hit[3]);
					if(area > 0){
						o.clearBrick(i);
						o.updateBallHit(hit);
						i = count;
					}
				}
			}
			//3.擦除上一个位置
			context.clearRect(nowBall.x - nowBall.r,nowBall.y - nowBall.r ,nowBall.r * 2,nowBall.r * 2);
			//4.根据 attrBall 值绘制新的位置
			o.drawBall(attrBall.x,attrBall.y,attrBall.r);
			ballTime = setTimeout(function(){
				o.render();
			},30);
		};

		//常规运动路径计算
		o.updateBall = function(){
			attrBall.x += attrBall.vx;
			attrBall.y += attrBall.vy;
			if(attrBall.x - attrBall.r <= 0){
				attrBall.x = attrBall.r;
				attrBall.vx = -attrBall.vx;
			}else if(attrBall.x + attrBall.r >= canvas.width){
				attrBall.x = attrBall.x - attrBall.r;
				attrBall.vx = -attrBall.vx;
			}
			if(attrBall.y - attrBall.r <= 0){
				attrBall.y = attrBall.r;
				attrBall.vy = -attrBall.vy;
			}else if(attrBall.y - attrBall.r > canvas.height){	// + attrBall.r + attrSlider.h
				o.over();
				/*attrBall.y = attrBall.y - attrBall.r;
				attrBall.vy = -attrBall.vy;*/
			}
		};
		//根据碰撞面，计算碰撞后的运动方向
		//hit - 碰撞面矩形坐标
		o.updateBallHit = function(hit){
			var w = hit[2] - hit[0];
			var h = hit[3] - hit[1];
			if(w >= h){
				attrBall.vy = -attrBall.vy;
			}
			if(h >= w){
				attrBall.vx = -attrBall.vx;
			}
		};
		//修正小球碰撞位置
		//collide - 障碍物顶点坐标及长宽
		//返回：最小碰撞面积的矩形坐标
		o.reviseBall = function(collide){
			var hit,area;
			var bx,by,br,lastHit;
			bx = attrBall.x - attrBall.r;
			by = attrBall.y - attrBall.r;
			br = attrBall.r * 2;
			lastHit = [0, 0, 0, 0];
			var i = Math.max(Math.abs(attrBall.vx),Math.abs(attrBall.vy));
			//从有重合的位置模拟循环后退，计算出碰撞点
			while(i >= 0){
				hit = o.checkHit(bx,by,br,br , collide.x,collide.y,collide.w,collide.h);
				area = o.getArea(hit[0],hit[1],hit[2],hit[3]);
				if(area == 0){
					attrBall.x = bx + attrBall.r;
					attrBall.y = by + attrBall.r;
					return lastHit;
				}else{
					//修正位置
					if(attrBall.vx > 0){
						bx--;
					}else{
						bx++;
					}
					if(attrBall.vy > 0){
						by--;
					}else{
						by++;
					}
					lastHit = hit;
				}
				i--;
			}
		};

		// 碰撞检测
		// 矩形一 top-left 坐标 (A, B), C 为 width, D 为 height
		// 矩形二 同上
		// 如果没有相交，返回 [0, 0, 0, 0]
		// 如果相交，假设相交矩形对角坐标 (x0, y0) (x1, y1) -- x1 > x0 & y1 > y0
		// return [x0, y0, x1, y1]
		//PS:以后可提升为像素级碰撞检测 http://www.cnblogs.com/zichi/p/5141044.html
		o.checkHit = function(A, B, C, D, E, F, G, H) {
			// 转为对角线坐标
			C += A, D += B, G += E, H += F;

			// 没有相交
			if (C <= E || G <= A || D <= F || H <= B)
			return [0, 0, 0, 0];

			var tmpX, tmpY;
			if (E > A) {
				tmpX = G < C ? [E, G] : [E, C];
			}else{
				tmpX = C < G ? [A, C] : [A, G];
			}
			if (F > B) {
				tmpY = H < D ? [F, H] : [F, D];
			}else{
				tmpY = D < H ? [B, D] : [B, H];
			}
			return [tmpX[0], tmpY[0], tmpX[1], tmpY[1]];
		}
		//根据坐标轴，返回矩形面积
		o.getArea = function(x0,y0,x1,y1){
			var area = (x1 - x0) * (y1 - y0);
			return area;
		};

		//终止游戏
		o.over = function(){
			context.font = "bold 30px Arial";
			context.textAlign = 'center';
			context.fillText("GG",parseInt(canvas.width / 2),50);
			window.clearInterval(ballTime);
		};

		//键盘事件
		o.keyboard = function(e){
			var step;
			if(e.keyCode == 37){	//左
				step = {x:-10};
			}else if(e.keyCode == 39){	//右
				step = {x:10};
			}
			if(step != undefined){
				//预防滑块侧向撞击产生 bug，有待改善
				var hit,area;
				var bx,by,br;
				bx = attrBall.x - attrBall.r;
				by = attrBall.y - attrBall.r;
				br = attrBall.r * 2;
				hit = o.checkHit(bx,by,br,br , attrSlider.x+step.x,attrSlider.y,attrSlider.w,attrSlider.h);
				area = o.getArea(hit[0],hit[1],hit[2],hit[3]);
				if(area == 0){
					o.drawSlider(step);
				}
				if(attrSlider.isInterval == 0){
					attrSlider.isInterval = 1;
					attrSlider.stime = setInterval(function(){
						o.keyboard(e);
					},30);
				}
			}
		};
		//清除键盘事件
		o.keyboardClear = function(){
			attrSlider.isInterval = 0;
			window.clearInterval(attrSlider.stime);
			$(document).one('keydown',o.keyboard);
		};

		//初始化界面
		o.init = function(e){
			//画布
			canvas = e.canvas;
			context = canvas.getContext("2d");
			canvas.width = document.body.clientWidth;
			canvas.height = document.body.clientHeight;
			//小球
			attrBall = {
				x : 0,	//圆心x轴
				y : 0,	//圆心y轴
				r : e.ballRadius ? e.ballRadius : 10,	//半径
				g : 1,	//速度系数
				vx : 4,	//x轴初始速度（位移量）
				vy : -4,	//y轴初始速度（位移量）
				color : e.ballColor ? e.ballColor : "#333",
			};
			//滑块
			attrSlider = {
				x : 0,
				y : 0,
				w : 800,
				h : 10,
				stime : "",	//setInterval 对象
				isInterval : 0,	//标记：是否正在 setInterval 方法中
			};
			//障碍物
			var brickNum = e.brickNum ? e.brickNum : 10
			attrBrick[0] = {x:100,y:100,w:100,h:30};
			for(var i = 1;i < brickNum;i++){
				attrBrick[i] = {x:100+attrBrick[i-1].x,y:100,w:100,h:30}
			}
			attrBall.x = parseInt(canvas.width / 2);
			attrBall.y = canvas.height - attrBall.r - attrSlider.h;
			attrSlider.x = parseInt(canvas.width / 2 - attrSlider.w / 2);
			attrSlider.y = canvas.height - attrSlider.h;

			o.drawBrick();
			o.drawSlider();
			o.drawBall(attrBall.x,attrBall.y,attrBall.r);
			o.render();
			$(document).one('keydown',o.keyboard);
			$(document).on('keyup',o.keyboardClear);
		};
		return o;
	}
};
